﻿<%@ Page Title="Register" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="Register.aspx.cs" Inherits="AjaxChatWebApp.Account.Register" %>

<asp:Content runat="server" ID="BodyContent" ContentPlaceHolderID="MainContent">
    <script>
        function readURL(input, imgFrame) {
            if (input.files && input.files[0]) {
                var reader = new FileReader();
                reader.onload = function (e) {
                    $("#" + imgFrame)
                        .attr('src', e.target.result)
                        .width(100)
                        .height(100);
                };

                reader.readAsDataURL(input.files[0]);
            }
        }
            </script>
    <h2>Register</h2>

    <p class="validation-summary-errors">
        <asp:Literal runat="server" ID="ErrorMessage" />
    </p>

    <fieldset>
        <legend>Registration Form</legend>
        <ol>
            <li>
                <asp:Label runat="server" AssociatedControlID="tbUserName">Username</asp:Label>
                <asp:TextBox runat="server" ID="tbUserName" />
                <asp:RequiredFieldValidator runat="server" ControlToValidate="tbUserName"
                    CssClass="field-validation-error" ErrorMessage="Username is required" />
            </li>
            <li>
                <asp:Label ID="Label1" runat="server" AssociatedControlID="tbFirstname">First Name</asp:Label>
                <asp:TextBox runat="server" ID="tbFirstName" />
                <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ControlToValidate="tbFirstName"
                    CssClass="field-validation-error" ErrorMessage="First name is required" />
            </li>
            <li>
                <asp:Label ID="Label2" runat="server" AssociatedControlID="tbLastName">Last Name</asp:Label>
                <asp:TextBox runat="server" ID="tbLastName" />
                <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ControlToValidate="tbLastName"
                    CssClass="field-validation-error" ErrorMessage="Last name is required" />
            </li>
            <li>
                <asp:Label ID="Label3" runat="server" AssociatedControlID="tbPassword">Password</asp:Label>
                <asp:TextBox runat="server" ID="tbPassword" TextMode="Password" />
                <asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server" ControlToValidate="tbPassword"
                    CssClass="field-validation-error" ErrorMessage="Password is required" />
            </li>
            <li>
                <asp:Label runat="server" AssociatedControlID="ConfirmPassword">Confirm Password</asp:Label>
                <asp:TextBox runat="server" ID="ConfirmPassword" TextMode="Password" />
                <asp:RequiredFieldValidator runat="server" ControlToValidate="ConfirmPassword"
                    CssClass="field-validation-error" Display="Dynamic" ErrorMessage="Confirm password is required" />
                <asp:CompareValidator runat="server" ControlToCompare="tbPassword" ControlToValidate="ConfirmPassword"
                    CssClass="field-validation-error" Display="Dynamic" ErrorMessage="Password and Confirm password does not match" />
            </li>
            <li>
                <asp:Label runat="server" AssociatedControlID="fuAvatar">Avatar</asp:Label>
                <asp:Image ID="imgAvatar" ImageUrl="../Avatars/defaultAvatar.png" 
                            Width="100px" Height="100px" BorderStyle="Solid" 
                            runat="server" BackColor="White" BorderColor="Gray" BorderWidth="1px" />
                <br />
                <asp:FileUpload ID="fuAvatar" onchange="readURL(this, 'MainContent_imgAvatar');" runat="server"/>
                <asp:RegularExpressionValidator ID="RegularExpressionValidator1" runat="server" ControlToValidate="fuAvatar"
                                                     CssClass="field-validation-error" Display="Dynamic"
                                                     ErrorMessage="Only .gif .jpg .png .tiff are allowed" 
                                                     ValidationExpression="(.*\.([Gg][Ii][Ff])|.*\.([Jj][Pp][Gg])|.*\.([pP][nN][gG])|.*\.([tT][iI][iI][fF])$)">
                </asp:RegularExpressionValidator> 
            </li>
        </ol>
        <asp:Button runat="server" Text="Register" ID="btReg" OnClick="btReg_Click" />
    </fieldset>
</asp:Content>